<template>
	<view class="upload-wrapper content-wrapper">
		<download-btn :dwnSrc="dwnSrc"></download-btn>
		<GlobalSlot>
			<view slot="funcExampleDetail">
				<!-- 引入组件 -->
				<JkUploadImage :count="9" :limit='3' @getImgListInfo="getImgListInfo"></JkUploadImage>
			</view>
			
			<view slot="funcIntroDetail">
				<p><label class="iconfont icon-pass"> </label>选择图片</p>
				<p><label class="iconfont icon-pass"> </label>上传图片</p>
				<p><label class="iconfont icon-pass"> </label>预览图片</p>
				<p><label class="iconfont icon-pass"> </label>删除图片</p>
				<p><label class="iconfont icon-pass"> </label>动态判断数量、大小、格式（判断格式仅在H5生效）</p>
			</view>
			
			<view slot="paramDetail">
				<view class="flexRowNoWrap param-table-row">
					<view class="col1"><label class="color-primary">*</label>limit</view>
					<view class="col2">最大允许上传个数</view>
					<view class="col3">number</view>
					<view class="col4">--</view>
					<view class="col5">9</view>
				</view>
				<view class="flexRowNoWrap param-table-row">
					<view class="col1">imgSize</view>
					<view class="col2">单张图片大小(M)</view>
					<view class="col3">number</view>
					<view class="col4">--</view>
					<view class="col5">2</view>
				</view>
				<view class="flexRowNoWrap param-table-row">
					<view class="col1">imgType</view>
					<view class="col2">图片类型</view>
					<view class="col3">string</view>
					<view class="col4">--</view>
					<view class="col5">.jpeg,.jpg,.png</view>
				</view>
			</view>
			
			<view  slot="callFuncDetail">
				<view class="flexRowNoWrap param-table-row">
					<view class="col6"><label class="color-primary">*</label>getImgListInfo</view>
					<view class="col7">Array</view>
					<view class="col8">获取图片信息</view>
				</view>
			</view>
			
			<view slot="directorInfo">
				童雅丽 2020年12月6日
			</view>
			
			<view slot="versionInfo">
				<p>----v1.0 童雅丽 2020年12月6日 完成组件基本功能</p>
				<p>----v2.0 童雅丽 2020年12月7日 修复删除图片缺陷</p>
				<p>----v3.0 童雅丽 2021年3月24日 增加回调函数</p>
			</view>
			
			<view slot="projectName">
				暂无
			</view>
			
			<view slot="terminalName">
				H5端、微信小程序端
			</view>
			
		</GlobalSlot>	
	</view>
</template>

<script>
	import JkUploadImage from '@/components/jk-upload-img/jk-upload-img.vue'
	export default {
		data() {
			return {
				dwnSrc:'jk-upload-img'
			}
		},
		components: {
			JkUploadImage
		},
		methods: {
			getImgListInfo(info) {
				console.log("----父组件传过来的图片Info---"+JSON.stringify(info))
			}
		},
		
	}
</script>

<style lang="scss">
	
	
</style>
